import React, {Component} from 'react'
// import {AtIcon} from 'taro-ui'
import Taro from '@tarojs/taro'
import {View} from '@tarojs/components'

import Weather from '../components/weather/index'
import {getStorageSync, showToast} from "../../utils/common";

import './index.scss'

type PageStateProps = {}

type PageDispatchProps = {}

type PageOwnProps = {}

type PageState = {
  // isShowName: string
  helperList: any[]
}

type IProps = PageStateProps & PageDispatchProps & PageOwnProps

interface CampusHelper {
  props: IProps;
}

// @inject('store')
// @observer
class CampusHelper extends Component<IProps, PageState> {
  constructor(props: IProps) {
    super(props);
    this.state = {
      helperList: [
        {
          id: 0,
          activityName: '热点活动',
          enName: 'Activity',
          children: [
            {
              id: 0,
              name: '手机评教',
              icon: 'iconfont icon-wenjuan'
            },
            {
              id: 1,
              name: '活动报名',
              icon: 'iconfont icon-zuopin'
            },
            {
              id: 2,
              name: '成绩查询',
              icon: 'iconfont icon-chaxun'
            }
          ]
        },
        {
          id: 1,
          activityName: '身份验证',
          enName: 'Auth',
          children: [
            {
              id: 0,
              name: '学号绑定',
              icon: 'iconfont icon-wode-bangdingguanxi'
            }
          ]
        }
      ]
      // isShowName: 'sunny'
    }
  }

  componentDidMount() {

  }

  handleShowNO(id, name) {
    const userInfo = getStorageSync('userInfo')
    if (id === 1 && name === '活动报名') {
      if(!userInfo.id) {
        return showToast('请先登录')
      }
      Taro.navigateTo({
        url: '/pages/active/index'
      })
    } else if (id === 0 && name === '学号绑定') {
      if(!userInfo.id) {
        return showToast('请先登录')
      }
      Taro.navigateTo({
        url: '/pages/stu-auth/index'
      })
    } else {
      showToast('暂未开发')
    }
  }

  render() {
    // const {isShowName} = this.state
    const {helperList} = this.state
    return (
      <View className='main_helper'>
        <Weather />
        {
          helperList.map(item => {
            return (
              <View className='helper_com' key={item.id}>
                <View className='helper_active_title'>
                  <View className='helper_active_title_left'>{item.activityName}</View>
                  <View className='helper_active_title_right'>{item.enName}</View>
                </View>
                <View className='helper_active_content'>
                  {
                    item.children.map(child => {
                      return (
                        <View
                          className='helper_active_content_item' key={child.id}
                          onClick={this.handleShowNO.bind(this, child.id, child.name)}
                        >
                          <View className={child.icon} />
                          <View className='helper_active_content_text'>{child.name}</View>
                        </View>
                      )
                    })
                  }
                </View>
              </View>
            )
          })
        }
      </View>
    )
  }
}

export default CampusHelper
